import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from './views/Home.vue'
import Main from './views/Main.vue'
import Article from './views/Article.vue'
import Hero from './views/Hero.vue'

Vue.use(VueRouter)

const routes = [
  {
    path: '/',
    // name: 'Main',
    component: Main,
    children: [
      {path: '/', name: 'Home', component: Home},
      { path: '/articles/:id', name: 'Article', component: Article, props: true }, //文章article和主页home一样都是子路由，将path中的id传递到组件中 props:true
    ]
  },
  {path: '/heroes/:id', name: 'hero', component: Hero, props: true},  
]

const router = new VueRouter({
  routes
})

export default router
